<template>
  <div>
    <a-card class="card" :bordered="false" :style="`min-height: ${cardMinHeight}px;`">
      <div class="div" style="display: flex;justify-content:
      space-between;align-items: center;width: 450px">
        <div style="background-color: cyan;margin-right: 20px">
          <span>提醒设置</span>
        </div>

        <div style="margin-right: 20px">
          <span style="margin-right: 10px">保养计划预警提前期(天):</span>
          <a-input v-model.trim="warnTime" style='width: 125px;height: 32px;' ></a-input>
        </div>
        <div>
          <a-button @click="submitWarnTime" type="primary" style="background-color: cyan;border: none"  >保存</a-button>
        </div>

      </div>
    </a-card>
  </div>
</template>

<script>

import {mapGetters} from "vuex";
import {getWarningTimeList, saveWarningTime} from "../../utils/interface";
import {message, Message} from "ant-design-vue";

export default {
  name: "basicSetting",
  components: {},
  data() {
    return {
      ID:undefined,
      warnTime:undefined,
      tabBarGutter: 0,
      tabBarStyle: {
        color: 'rgba(0, 0, 0, 0.85)'
      },
      bodyStyle: {
        'padding': '0px 24px 24px 24px',
        'font-size': '14px',
        'line-height': '1.5',
        'word-wrap': 'break-word',
      },
      cardMinHeight: 0,
    }
  },
  watch: {},
  computed: {
    ...mapGetters(['getCardMinHeight']),
  },
  created() {
    this.cardMinHeight = this.getCardMinHeight
  },
  async mounted() {
    await this.initialize()
  },
  methods: {
    async initialize() {
      let searchWarnTime = await getWarningTimeList()
      this.warnTime = (searchWarnTime[0].time / 24).toFixed(2);
      this.ID = searchWarnTime[0]?.id || ''

    },
    async submitWarnTime() {
      let res = await saveWarningTime({'id': 1, 'time': this.warnTime * 24})
      message.success('保存成功')
      await this.initialize()

    }
  }
}
</script>

<style scoped lang="less">
.hide-scrollbar::-webkit-scrollbar {
  display: none; /* 隐藏滚动条 */
}

.hide-scrollbar {
  -ms-overflow-style: none;  /* IE 和 Edge */
  scrollbar-width: none;  /* Firefox */
  overflow-y: scroll; /* 保持内容可滚动 */
}
.demo-infinite-container {
  margin-top: 0px;
  border: 1px solid #e8e8e8;
  border-radius: 4px;
  overflow: auto;
  padding: 8px 24px;
  height: 300px;
}
/deep/ .ant-form-inline .ant-form-item-with-help{
  margin-bottom: 0px;
}
/deep/ .ant-input[disabled]{
  pointer-events: none;
  color: #000000d9;
  background-color: #f5f5f5;
  cursor: not-allowed;
  opacity: 1;
}
/deep/ .unit .ant-select-selection--single{
  margin-left: 0px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-left: 0;
}
/deep/ .ant-select-disabled .ant-select-selection {
  background-color: #fff;
}
/deep/ .ant-input[disabled]{
  pointer-events: none;
  color: #000000d9;
  background-color: #fff;
  cursor: not-allowed;
  opacity: 1;
}
/deep/ .ant-input-number-disabled{
  pointer-events: none;
  color: #000000d9;
  background-color: #fff;
  cursor: not-allowed;
  opacity: 1;
}
</style>